<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="/struts-tags" prefix="s" %>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title>商品类目</title>

    <script type="text/javascript">
        $(function(){
            $("#product").addClass("active");
            $("#product").find("ul li").eq(1).addClass("active");
        })
    </script>
</head>
  
  <body>

		
	  <div class="admin">
	     <div class="form-x" id="form" >
	     <div class="panel" style="margin-top: -15px; margin-left: -12px;">
				<div class="panel-head">
					<strong>选择类目</strong>
				</div>
				<div class="panel-body" style="height:px;">
				      <div class="form-group" style="height:">
							<div class="label">
								<label for="sitename" style="font-weight:normal;">
									选择常用目录&nbsp;&nbsp;&nbsp;
								</label>
							</div>
							<div class="field">
								<select id="selectid" class="border radius" style="width:100%;height:35px;"  name="product.oneclassfiyid" onchange="choosec();">
                                   <option id="option00" value="0" >选择常用类目</option>
                    	           <s:iterator value="changyongs" id="ch">
                                   <option value="<s:property value="id"/>"><s:property value="onename"/>---<s:property value="twoname"/>
                                           <s:if test="#ch.threename!=null">
                                           ---<s:property value="threename"/>
                                           </s:if>
                                           <s:if test="#ch.fourname!=null">
                                           ---<s:property value="fourname"/>
                                           </s:if>
                                   </option>
                                   </s:iterator>
                                </select>
                                
                                <div id="haschang">
                                <s:iterator value="changyongs">
                                <input id="one<s:property value="id"/>" type="hidden" value="<s:property value="skuoneid"/>"/>
                                <input id="two<s:property value="id"/>" type="hidden" value="<s:property value="skutwoid"/>"/>
                                <input id="three<s:property value="id"/>" type="hidden" value="<s:property value="skuthreeid"/>"/>
                                <input id="four<s:property value="id"/>" type="hidden" value="<s:property value="skufourid"/>"/>
                                </s:iterator>
                                </div>
							</div>
						</div>
						<div class="form-group">
							<div class="label">
								<label for="sitename" style="font-weight:normal;">
									您当前选择的是&nbsp;&nbsp;&nbsp;
								</label>
							</div>
							<div class="field">
							    <form name="form" action="<%=request.getContextPath()%>/admin/product/classify!productclassify.action" id="form" method="post" enctype="multipart/form-data">
								<div style="float:left;margin-top:7px;"><span>
								      <s:if test="skuclassify1!=null">
								      <span id="cone" style="">${skuclassify1.name}</span>
								      <input id="oneone1" type="hidden" name="product.skuclassfiyid1" value="${skuclassify1.id}" />
								      </s:if>
								      <s:else>
								      <span id="cone" style=""></span>
								      <input id="oneone1" type="hidden" name="product.skuclassfiyid1" value="0" />
								      </s:else>
								      
								      <s:if test="skuclassify2!=null">
								      <span id="ctwo" style="display:;">---${skuclassify2.name}</span>
								      <input id="twotwo1" type="hidden" name="product.skuclassfiyid2" value="${skuclassify2.id}" />
								      </s:if>
								      <s:else>
								      <span id="ctwo" style="display:;"></span>
								      <input id="twotwo1" type="hidden" name="product.skuclassfiyid2" value="0" />
								      </s:else>
								      
								      <s:if test="skuclassify3!=null">
								      <span id="cthree" style="display:;">---${skuclassify3.name}</span>
								      <input id="threethree1" type="hidden" name="product.skuclassfiyid3" value="${skuclassify3.id}" />
								      </s:if>
								      <s:else>
								      <span id="cthree" style="display:;"></span>
								      <input id="threethree1" type="hidden" name="product.skuclassfiyid3" value="0" />
								      </s:else>
								      
								      <s:if test="skuclassify4!=null">
								      <span id="cfour" style="display:;">---${skuclassify4.name}</span>
								      <input id="fourfour1" type="hidden" name="product.skuclassfiyid4" value="${skuclassify4.id}" />
								      </s:if>
								      <s:else>
								      <span id="cfour" style="display:;"></span>
								      <input id="fourfour1" type="hidden" name="product.skuclassfiyid4" value="0" />
								      </s:else>
								</span>
								</div>
								</form>
								
								
								<div  style="width:13%;float:right;margin-right:0%;"><a onclick="setc();"><div style="width:100%;height:35px;line-height:35px;text-align:center;color:#fff;border-radius:5%;float:left;background:#00AAEE">设为常用类目</div></a></div>
							</div>
							<div style="clear:both;margin-left:5%;margin-top:7px;"><span style="color:#A9A9A9;">（商品上架后不可修改，请谨慎选择）</span>
								</div>
				        </div>
						<script type="text/javascript">
						//$('input[name=myInput]').change(function(){alert();});
						    //此方法用来搜索sku
						    var flag=true;
						    function aa(obj,lev,type){
						        //lev表示第几级sku查询，type：0表示input触发该方法，1表示手动点击搜索按钮
						        var skuname;
						        if(type==0){
						           skuname=obj.value.trim();
						        }else{
						           skuname=$(obj).parent().children('input').val();
						        }
						        if(lev==2){
						           var refid = $('#oneone1').val();
						           $('#input_id1').val('');//把其他搜索框的清空
						           $('#input_id3').val('');
						           $('#input_id4').val('');
						           $('#threethree').children().css('background','');//把下面级别的选中状态去掉
						           $('#fourfour').children().css('background','');
						           
						        }else if(lev==3){
						           var refid = $('#twotwo1').val();
						           $('#input_id1').val('');
						           $('#input_id2').val('');
						           $('#input_id4').val('');
						           $('#fourfour').children().css('background','');
						        }else if(lev==4){
						           var refid = $('#threethree1').val();
						           $('#input_id1').val('');
						           $('#input_id2').val('');
						           $('#input_id3').val('');
						        }else{
						           var refid = 0;
						           $('#input_id4').val('');
						           $('#input_id2').val('');
						           $('#input_id3').val('');
						           $('#threethree').children().css('background','');//把下面级别的选中状态去掉
						           $('#fourfour').children().css('background','');
						           $('#twotwo').children().css('background','');
						        }
						        //alert(refid);
						        if(flag){
						           flag=false;
						           $.ajax({
											'url':'classify!mhsearch.action',
											'type':'post',
											'data':{'name':skuname,'lev':lev,'refid':refid},
											'dataType':'json',
											'success':function(data){
											   //alert(data.length);
											  flag = true;
											  if(lev==1){
											    $('#oneone').empty();
											  }else if(lev==2){
											    $('#twotwo').empty();
											  }else if(lev==3){
											    $('#threethree').empty();
											  }else{
											    $('#fourfour').empty();
											  }
											  
											  for(var i=0;i<data.length;i++){
											  var s = data[i];
											  if(lev==1){
											   $('#oneone').append('<li class="oneone" style="list-style-type:none;height:25px;line-height:25px;">'
											   +'<a style="display:block;" id="one0'
											   +s.id
											   +'" onclick="findtwo(this,'
											   +s.id
											   +');">'
											   +s.name
											   +'</a></li>'
											   );
											  }else if(lev==2){
											   $('#twotwo').append('<li class="twotwo" style="list-style-type:none;height:25px;line-height:25px;">'
											   +'<a style="display:block;" id="two0'
											   +s.id
											   +'" onclick="findthree(this,'
											   +s.id
											   +');">'
											   +s.name
											   +'</a></li>'
											   );
											  }else if(lev==3){
											   $('#threethree').append('<li class="threethree" style="list-style-type:none;height:25px;line-height:25px;">'
											   +'<a style="display:block;" id="three0'
											   +s.id
											   +'" onclick="findfour(this,'
											   +s.id
											   +');">'
											   +s.name
											   +'</a></li>'
											   );
											  }else{
											   $('#fourfour').append('<li class="fourfour" style="list-style-type:none;height:25px;line-height:25px;">'
											   +'<a style="display:block;" id="four0'
											   +s.id
											   +'" onclick="choosefour(this,'
											   +s.id
											   +');">'
											   +s.name
											   +'</a></li>'
											   );
											  }
											  }
											},
											'error':function(){
											    alert("请求失败！");
											    flag = true;
											}
										});
								    }
						    }
						</script>
                        <div style="margin-left:5%;margin-top:5px;">
                           <s:if test="skuclassify1!=null">
                           <div  id="oneone0" style="float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,1,0)" id="input_id1" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,1,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               
                               <ul id="oneone" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                                  <s:iterator value="skuclassify1s" id="sku1">
                                  <s:if test="#sku1.id==skuclassify1.id">
                                  <li class="oneone" style="background:#128fd5;list-style-type:none;height:25px;line-height:25px;">
                                      <s:if test="name.length()>12">
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
                                      </s:if>
                                      <s:else>
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name"/></a>
                                      </s:else>
                                  </li>
                                  </s:if>
                                  <s:else>
                                  <li class="oneone" style="list-style-type:none;height:25px;line-height:25px;">
                                      <s:if test="name.length()>12">
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
                                      </s:if>
                                      <s:else>
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name"/></a>
                                      </s:else>
                                  </li>
                                  </s:else>
                                  </s:iterator>
                               </ul>
                           </div>
                           </s:if>
                           <s:else>
                           <div  id="oneone0" style="float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,1,0)" id="input_id1"  name="myInput" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,1,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               
                               <ul id="oneone" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                                  <s:iterator value="skuclassify1s" id="s1ku">
                                  <li class="oneone" style="list-style-type:none;height:25px;line-height:25px;">
                                      <s:if test="name.length()>12">
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
                                      </s:if>
                                      <s:else>
                                      <a style="display:block;" id="one0<s:property value="id"/>" onclick="findtwo(this,<s:property value="id"/>);"><s:property value="name"/></a>
                                      </s:else>
                                  </li>
                                  </s:iterator>
                               </ul>
                           </div>
                           </s:else>
                           
                           <s:if test="skuclassify2!=null">
                           <div id="twotwo0" style="display:;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,2,0)" id="input_id2" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,2,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="twotwo" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                                   <s:iterator value="skuclassify2s" id="sku2">
                                       <s:if test="#sku2.id==skuclassify2.id">
                                       <li class="twotwo" style="background:#128fd5;list-style-type:none;height:25px;line-height:25px;">
							              <s:if test="name.length()>12">
							              <a style="display:block;" id="two0<s:property value="id"/>" onclick="findthree(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
	                                      <a style="display:block;" id="two0<s:property value="id"/>" onclick="findthree(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>
							           </s:if>
							           <s:else>
							           <li class="twotwo" style="list-style-type:none;height:25px;line-height:25px;">
							               <s:if test="name.length()>12">
							              <a style="display:block;" id="two0<s:property value="id"/>" onclick="findthree(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
	                                      <a style="display:block;" id="two0<s:property value="id"/>" onclick="findthree(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>
							           </s:else>
                                   </s:iterator>
                               </ul>
                           </div>
                           </s:if>
                           <s:else>
                           <div id="twotwo0" style="display:none;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,2,0)" id="input_id2" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,2,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="twotwo" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                               
                               </ul>
                           </div>
                           </s:else>
                           
                           <s:if test="skuclassify3!=null">
                           <div id="threethree0" style="display:;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,3,0)" id="input_id3" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,3,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="threethree" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                                    <s:iterator value="skuclassify3s" id="sku3">
                                       <s:if test="#sku3.id==skuclassify3.id">
                                       <li class="threethree" style="background:#128fd5;list-style-type:none;height:25px;line-height:25px;">
                                          <s:if test="name.length()>12">
							                <a style="display:block;" id="three0<s:property value="id"/>" onclick="findfour(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="findfour(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>      
                                       </s:if>
                                       <s:else>
                                       <li class="threethree" style="list-style-type:none;height:25px;line-height:25px;">
                                           <s:if test="name.length()>12">
							                <a style="display:block;" id="three0<s:property value="id"/>" onclick="findfour(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="findfour(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>
                                       </s:else>
                                    </s:iterator>
                               </ul>
                           </div>
                           </s:if>
                           
                           <s:else>
                           <div id="threethree0" style="display:none;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,3,0)" id="input_id3" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,3,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="threethree" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                               
                               </ul>
                           </div>
                           </s:else>
                           
                           <s:if test="skuclassify4!=null">
                           <div id="fourfour0" style="display:;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,4,0)" id="input_id4" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,4,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="fourfour" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                                    <s:iterator value="skuclassify4s" id="sku4">
                                       <s:if test="#sku4.id==skuclassify4.id">
                                       <li class="fourfour" style="background:#128fd5;list-style-type:none;height:25px;line-height:25px;">
                                           <s:if test="name.length()>12">
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="choosefour(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="choosefour(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>      
                                       </s:if>
                                       <s:else>
                                       <li class="fourfour" style="list-style-type:none;height:25px;line-height:25px;">
                                           <s:if test="name.length()>12">
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="choosefour(this,<s:property value="id"/>);"><s:property value="name.substring(0,11)"/>...</a>
	                                      </s:if>
	                                      <s:else>
                                           <a style="display:block;" id="three0<s:property value="id"/>" onclick="choosefour(this,<s:property value="id"/>);"><s:property value="name"/></a>
	                                      </s:else>
							           </li>
                                       </s:else>
                                    </s:iterator>
                               </ul>
                           </div>
                           </s:if>
                           
                           <s:else>
                           <div id="fourfour0" style="display:none;float:left;width:23%;height:420px;">
                               <div style="height:50px;line-height:50px;border:1px solid #DCDCDC;">
                                  <div style="margin-left:10%;margin-top:10px;height:30px;line-height:30px;background:#FFF;width:80%;border:1px solid #DCDCDC;">
                                     <input oninput="aa(this,4,0)" id="input_id4" style="height:24px;border:none;width:82%;" type="text" placeholder="请输入类目名称" />
                                     <button onclick="aa(this,4,1);" style="background:#FFf;height:24px;border:none;width:13.5%;" class="icon-search"> </button>
                                  </div>
                               </div>
                               <ul id="fourfour" style="border:1px solid #DCDCDC;height:300px;OVERFLOW-Y: auto;OVERFLOW-X:hidden;">
                               
                               </ul>
                           </div>
                           </s:else>
                        </div>
                        <div style="clear:both;margin-left:5%;"><button class="button bg-blue" onclick="checkForm();">提交</button></div>
				
				</div>
		 </div>
		 </div>
		 <div style="clear: both;height: 30px;"></div>
		 <!-- 用来标示是否是执行的是常用类目 -->
		 <input id="biaoshi" type="hidden" value="0"/>
	  </div>
	  <script type="text/javascript">
	     //选择四级类目
	    function choosefour(obj,id){
	         var biaoshi = $('#biaoshi').val();//获取标示的值如果为1，则表示选的是常用类目
		      if(biaoshi==0){
		         $('#selectid').val("0");//把已选的常用类目还原
		      }
		      $('#cfour').html("----"+obj.innerHTML);//已选的类目
		      var fours=document.getElementsByClassName("fourfour");
		      for(var i=0;i<fours.length;i++){
		           fours[i].style.background="";
		      }
		      obj.parentNode.style.background="#128fd5";
		      $('#fourfour1').val(id);
		      
		      //执行完单击把标示改成0
		      var id0 = $('#selectid option:selected').val();
				if(id0!=0){
				    var fourid = $('#four'+id0).val();
				    if(fourid != 0){
				    $('#biaoshi').val('0');
				    }
				}
	    }
	     //选择三级类目切换四级类目
	    function findfour(obj,id){
	        //alert("111");
	        var biaoshi = $('#biaoshi').val();//获取标示的值如果为1，则表示选的是常用类目
	        if(biaoshi==0){
	         $('#selectid').val("0");//把已选的常用类目还原
	        }
	        $('#cthree').html("----"+obj.innerHTML);//已选的类目
	        $('#cfour').html('');//清空已选sku的name
	        $('#fourfour1').val('');//清空已选sku的id
	        //清空之前的选中样式，把新选中的加上样式
	        var threes=document.getElementsByClassName("threethree");
	        for(var i=0;i<threes.length;i++){
	           threes[i].style.background="";
	        }
	        obj.parentNode.style.background="#128fd5";
	        document.getElementById("fourfour0").style.display="none";//把原来二级对应的三级先隐藏再操作，避免运行延迟或者新二级没有对应的三级
	      
	        var parent = document.getElementById("fourfour");
	        var childs = parent.childNodes;
	        $.ajax({
					'url':'product!skuclassify4.action',
					'type':'post',
					'data':{'skuclassify4.skuclassifyid3':id},
					'dataType':'json',
					'success':function(data){
					//data是服务器返回的数据
					    for(var a = childs.length - 1; a >= 0; a--){ 
                           parent.removeChild(childs[a]); 
                        }
                        if(data.length>0){
							document.getElementById("fourfour0").style.display="";
							for(i=0;i<data.length;i++){
							    var s = data[i];
							    var name;
							    if(s.name.length>12){
							       name = s.name.substring(0,11)+"...";
							    }else{
							       name = s.name;
							    }
								$('#fourfour').append('<li class="fourfour" style="list-style-type:none;height:25px;line-height:25px;">'
								+'<a style="display:block;" id="four0'
								+s.id
								+'" onclick="choosefour(this,'
								+s.id
								+');">'
								+name
								+'</a></li>'
								);
							}
						}
						$('#threethree1').val(id);
				      //如果标示为1，执行单击
						var id0 = $('#selectid option:selected').val();
						if(biaoshi==1){
						   var fourid = $('#four'+id0).val();
	                       $('#four0'+fourid).click();
						}
					   //执行完单击把标示改成0
	                   var id0 = $('#selectid option:selected').val();
				       if(id0!=0){
				           var fourid = $('#four'+id0).val();
				           if(fourid == 0){
				              $('#biaoshi').val('0');
				           }
				       }

					},
					'error':function(){
					    alert("请求失败！");
					}
				});
				
	    }
	     
	    //点击二级类目切换三级类目
	    function findthree(obj,id){
	        //alert("111");
	        var biaoshi = $('#biaoshi').val();//获取标示的值如果为1，则表示选的是常用类目
	        if(biaoshi==0){
	         $('#selectid').val("0");//把已选的常用类目还原
	        }
	        $('#ctwo').html("----"+obj.innerHTML);//已选的类目
	        $('#cthree').html('');$('#cfour').html('');//清空已选sku的name
	        $('#threethree1').val('');$('#fourfour1').val('');//清空已选sku的id
	        //清空之前的选中样式，把新选中的加上样式
	        var twos=document.getElementsByClassName("twotwo");
	        for(var i=0;i<twos.length;i++){
	           twos[i].style.background="";
	        }
	        obj.parentNode.style.background="#128fd5";
	        document.getElementById("threethree0").style.display="none";//把原来二级对应的三级先隐藏再操作，避免运行延迟或者新二级没有对应的三级
	        document.getElementById("fourfour0").style.display="none";
	        
	        var parent = document.getElementById("threethree");
	        var childs = parent.childNodes;
	        $.ajax({
					'url':'product!skuclassify3.action',
					'type':'post',
					'data':{'skuclassify3.skuclassifyid2':id},
					'dataType':'json',
					'success':function(data){
					//data是服务器返回的数据
					    for(var a = childs.length - 1; a >= 0; a--){ 
                           parent.removeChild(childs[a]); 
                        }
                        if(data.length>0){
							document.getElementById("threethree0").style.display="";
							for(i=0;i<data.length;i++){
							    var s = data[i];
							    var name;
							    if(s.name.length>12){
							       name = s.name.substring(0,11)+"...";
							    }else{
							       name = s.name;
							    }
								$('#threethree').append('<li class="threethree" style="list-style-type:none;height:25px;line-height:25px;">'
								+'<a style="display:block;" id="three0'
								+s.id
								+'" onclick="findfour(this,'
								+s.id
								+');">'
								+name
								+'</a></li>'
								);
							}
						}
						$('#twotwo1').val(id);
				      //如果标示为1，执行单击
						var id0 = $('#selectid option:selected').val();
						if(biaoshi==1){
						   var threeid = $('#three'+id0).val();
	                       $('#three0'+threeid).click();
						}
						if(data.length<=0){
						  //执行完单击把标示改成0
		                  var id0 = $('#selectid option:selected').val();
					      if(id0!=0){
					          var threeid = $('#three'+id0).val();
					          if(threeid == 0){
					             $('#biaoshi').val('0');
					          }
					      }
						}

					},
					'error':function(){
					    alert("请求失败！");
					}
				});
				
	    }
	   
	   
	  //提交时判断是否选择了sku
	    function checkForm(){
	        var flag = false;
	        var threes = $('#threethree').children();
	        var twos = $('#twotwo').children();
	        var fours = $('#fourfour').children();
	        
	        if(fours.length>0){
	           for(var i=0;i<fours.length;i++){
	               if(fours[i].style.background!=""){
	                  flag = true
	               }
	           }
	        }else if(threes.length>0){
	           for(var i=0;i<threes.length;i++){
	               if(threes[i].style.background!=""){
	                  flag = true
	               }
	           }
	        }else if(twos.length>0){
	           for(var i=0;i<twos.length;i++){
	               if(twos[i].style.background!=""){
	                  flag = true
	               }
	           }
	        }
	        
	        if(flag==false){
	           alert("请您选择类目！");
	        }else{
	           document.form.submit();
	        }
	    }
	  //选择常用类目
	    function choosec(){
	      //取到常用类目的id
	      $('#biaoshi').val('1');
	      var id = $('#selectid option:selected').val();
	      //取到已选三级sku的id
	      if(id!=0){
	          var oneid = $('#one'+id).val();
	          $('#one0'+oneid).click();
	      }else{
	          
	      }
	    }
	    //点击一级类目切换二级类目
	    function findtwo(obj,id){
	      //alert("000");
	      var biaoshi = $('#biaoshi').val();//获取标示的值如果为1，则表示选的是常用类目
	      if(biaoshi==0){
	         $('#selectid').val("0");//把已选的常用类目还原
	      }
	      $('#cone').html(obj.innerHTML);//已选的类目
	      $('#ctwo').html('');$('#cthree').html('');$('#cfour').html('');//清空已选sku的name
	      $('#twotwo1').val('');$('#threethree1').val('');$('#fourfour1').val('');//清空已选sku的id
	      
	      var ones=document.getElementsByClassName("oneone");
	      for(var i=0;i<ones.length;i++){
	         ones[i].style.background="";
	        // alert(ones[i].childNodes[0].style.color);
	      }
	      obj.parentNode.style.background="#128fd5";
	      $(obj).parent().css('color','red');
	      document.getElementById("twotwo0").style.display="none";
	      document.getElementById("threethree0").style.display="none";
	      document.getElementById("fourfour0").style.display="none";
	      
	      var parent = document.getElementById("twotwo");
	      var childs = parent.childNodes;
	      $.ajax({
					'url':'product!skuclassify2.action',
					'type':'post',
					'data':{'skuclassify2.skuclassifyid1':id},
					'dataType':'json',
					'success':function(data){
					   //data是服务器返回的数据
					   //alert(data);
					   //清除缓存
					    for(var a = childs.length - 1; a >= 0; a--){ 
                           parent.removeChild(childs[a]); 
                        }
					    if(data!=null){
						document.getElementById("twotwo0").style.display="";
						for(i=0;i<data.length;i++){
						    var s = data[i];
						    var name;
							    if(s.name.length>12){
							       name = s.name.substring(0,11)+"...";
							    }else{
							       name = s.name;
							    }
							$('#twotwo').append('<li class="twotwo" style="list-style-type:none;height:25px;line-height:25px;">'
							+'<a style="display:block;" id="two0'
							+s.id
							+'" onclick="findthree(this,'
							+s.id
							+');">'
							+name
							+'</a></li>'
							);
						}
						}
						
						$('#oneone1').val(id);
						//如果标示为1，执行单击
						var id0 = $('#selectid option:selected').val();
						if(biaoshi==1){
						var twoid = $('#two'+id0).val();
	                    $('#two0'+twoid).click();
						}
					},
					'error':function(){
					    alert("请求失败！");
					}
				});
				
	    }
       </script>
       <script type="text/javascript">
        
        //设置常用目录
        function setc(){
            //alert();
            var skuoneid = $('#oneone1').val();
            var skutwoid = $('#twotwo1').val();
            var skuthreeid = $('#threethree1').val();
            var skufourid = $('#fourfour1').val();
            
            $.ajax({
					'url':'product!setchang.action',
					'type':'post',
					'data':{'changyong.skuoneid':skuoneid,'changyong.skutwoid':skutwoid,'changyong.skuthreeid':skuthreeid,'changyong.skufourid':skufourid},
					'dataType':'json',
					'success':function(data){
					   //data是服务器返回的数据
					   alert("设置成功！");
					   
					   $('#selectid').append('<option id="chang'
					   +data.id
					   +'" value="'
					   +data.id
					   +'">'
					   +data.onename
					   +'---'
					   +data.twoname
					   +'</option>'
					   );
					   
					   if(data.skuthreeid!=0){
					      $('#chang'+data.id).append('---'
					      +data.threename
					      );
					   }
					   if(data.skufourid!=0){
					      $('#chang'+data.id).append('---'
					      +data.fourname
					      );
					   }
					   
					   $('#haschang').append('<input id="one'
					   +data.id
					   +'" type="hidden" value="'
					   +data.skuoneid
					   +'"/>'
					   );
					   $('#haschang').append('<input id="two'
					   +data.id
					   +'" type="hidden" value="'
					   +data.skutwoid
					   +'"/>'
					   );
					   $('#haschang').append('<input id="three'
					   +data.id
					   +'" type="hidden" value="'
					   +data.skuthreeid
					   +'"/>'
					   );
					   $('#haschang').append('<input id="four'
					   +data.id
					   +'" type="hidden" value="'
					   +data.skufourid
					   +'"/>'
					   );
					   
					},
					'error':function(){
					    alert("请求失败！");
					}
				});
        }
</script>
  </body>
</html>
